<template>
	 <view class="m-notice">
		 <view class="n-top">
			 <view class="n-title">
			 			 公告信息
			 </view>
			 <view class="n-more" @tap="goNextPage('noticeMsg')">更多 ></view>
		 </view>
		 <view class="n-content" >
			 <view class="c-box" v-for="(item,index) in list" :key="index" :dat-id="item.id"a @tap="goPage(item)">
				 <view class="b-title">{{item.name}}</view>
				 <view class="b-content">{{item.intro}}</view>
				 <view class="b-time">{{item.time}}</view>
			 </view>
		 </view>
	 </view>
</template>

<script>
	export default{
		name:"m-notice",
		props:{
			list:{
				type:Array,
				default(){
					return []
				}
			}
		},
		methods:{
			goPage(item){
				this.$router.push({
					route:this.$routesConfig.noticeDetail,
					query:{id:item.id}
				})
			},
			goNextPage(name){
				this.$router.push({
					route:this.$routesConfig[name],
				})
			}
		}
	}
</script>

<style scoped lang="less">
	 .m-notice{
		 width: 650rpx;
		 margin: 0 50rpx;
		 .n-top{
			position: relative;
			width: 100%;
			 height: 80rpx;
			 .n-title{
				 width: 100%;
				 text-align: center;
				 line-height: 80rpx;
				 font-size: 30rpx;
				 font-weight: bold;
				 color: #333333;
			 }
			 .n-more{
				 position: absolute;
				 top: 50%;
				 transform: translate(0,-50%);
				 right: 0;
				 font-size: 26rpx;
				 color:orange;
			 }
		 }
		 .n-content{
			 .c-box{
				 padding: 10rpx 10rpx 0 10rpx;
				 border-top: dotted 1px gray;
				 .b-title{
					 font-size: 28rpx;
					 line-height: 60rpx;
					 color: #333333;
				 }
				 .b-content{
					 font-size: 24rpx;
					 color: gray;
					 line-height: 60rpx;
				 }
				 .b-time{
					 font-size: 20rpx;
					 color: gray;
					 line-height: 60rpx;
				 }
			 }
		 }

	 }
</style>
